<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title>个人主页</title>
    <!-- Stylesheets -->
    <link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
    <link href="css/responsive.css" rel="stylesheet">

    <!--Favicon-->
    <link rel="shortcut icon" href="images/favicon.png" type="image/x-icon">
    <link rel="icon" href="images/favicon.png" type="image/x-icon">
    <!-- Responsive -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
</head>

<body>

    <audio id="vd">
        <source src="./mp3/rather be.mp3">
    </audio>
    <div class="page-wrapper default-version">
        <!-- Preloader -->
        <div class="preloader"></div>

        <div class="page-background">
            <div class="image-1"><img src="images/icons/shape/icon-1.png" alt=""></div>
            <div class="image-7"><img src="images/icons/shape/icon-7.png" alt=""></div>
            <canvas id="canvas"></canvas>
        </div>

        <!-- Mobile menu -->
        <div class="mobile-menu">
            <div class="container">
                <!--Nav Outer-->
                <div class="nav-outer clearfix">
                    <div class="logo">
                        <a href="index.html"><img src="images/logo.png" alt=""></a>
                    </div>
                    <!-- Main Menu -->
                    <nav class="main-menu">
                        <div class="navbar-header">
                            <!-- Toggle Button -->
                            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                            </button>
                        </div>

                        <div class="navbar-collapse collapse scroll-nav clearfix">
                            <ul class="navigation clearfix">

                                <li class="current"><a href="#home">主页</a></li>
                                <li><a href="#about">关于</a></li>
                                <li><a href="#resume">简历</a></li>
                                <li><a href="#services">服务</a></li>
                                <li><a href="#work">工作</a></li>
                                <li><a href="#blog">博客</a></li>
                                <li><a href="#contact">联系</a></li>

                            </ul>
                        </div>
                    </nav>
                    <!-- Main Menu End-->
                </div>
                <!--Nav Outer End-->
            </div>
        </div>

        <div class="card-outer">
            <div class="scroll-box">
                <div class="container" data-animation-in="fadeInLeft" data-animation-out="fadeOutLeft">
                    <div class="card-wrapper">
                        <div class="author-info" style="background-image:url(images/background/3.jpg)">
                            <div class="image"><img src="images/resource/user.png" alt=""></div>
                            <div class="author">
                                <h3>何飞</h3>
                                <div class="designation">
                                    你好，我是
                                    <div class="typing-title">
                                        <p>一个 <strong>前端开发者</strong></p>
                                        <p>一个 <strong>网页设计者</strong></p>
                                        <p>一个 <strong>计算机爱好者</strong></p>
                                    </div>
                                    <span class="typed-title"></span>
                                </div>
                            </div>
                            <div class="link-btn">
                                <a href="./个人简历.pdf" class="theme-btn btn-style-one">下载简历</a>
                            </div>
                            <ul class="social-icon-two">
                                <li><a href="#"><span class="fa fa-facebook"></span></a></li>
                                <li><a href="#"><span class="fa fa-twitter"></span></a></li>
                                <li><a href="#"><span class="fa fa-google-plus"></span></a></li>
                                <li><a href="#"><span class="fa fa-pinterest"></span></a></li>
                            </ul>
                        </div>
                        <div class="card-inner-box">
                            <header class="header wow fadeInLeft" data-wow-duration="1.5s">
                                <ul class="main-menu">
                                    <li class="active home">
                                        <a class="logo" href="#home"><img src="images/logo.png" alt=""></a>
                                    </li>
                                    <li><a href="#about"><i class="flaticon-social"></i>关于</a></li>
                                    <li><a href="#resume"><i class="flaticon-curriculum"></i>简历</a></li>
                                    <li><a href="#services"><i class="flaticon-layers-1"></i>服务</a></li>
                                    <li><a href="#work"><i class="flaticon-tools"></i>工作</a></li>
                                    <li><a href="#blog"><i class="flaticon-blog"></i>博客</a></li>
                                    <li><a href="#contact"><i class="flaticon-send-mail"></i>联系</a></li>
                                </ul>
                            </header>
                            <!-- card item -->
                            <div class="card-home card-item active" id="home" style="background-image:url(images/background/1.jpg)">

                                <div class="card-inner wow fadeInUp" data-wow-duration="2s">
                                    <div class="image"><img src="images/resource/user.png" alt=""></div>
                                    <div class="author">
                                        <h3>何飞</h3>
                                        <div class="designation">
                                            你好，我是
                                            <div class="typing-title">
                                                <p>一个 <strong>前端开发者</strong></p>
                                                <p>一个 <strong>网页设计者</strong></p>
                                                <p>一个 <strong>计算机爱好者</strong></p>
                                            </div>
                                            <span class="typed-title"></span>
                                        </div>
                                    </div>
                                    <div class="text">一个好的程序员是那种过单行线马路都要往两边看的人</div>
                                    <div class="link-btn">
                                        <a href="./个人简历.pdf" class="theme-btn btn-style-one">下载简历</a>
                                        <a href="#" class="theme-btn btn-style-two">录用我</a>
                                    </div>
                                    <ul class="social-icon-two">
                                        <li><a href="#"><span class="fa fa-facebook"></span></a></li>
                                        <li><a href="#"><span class="fa fa-twitter"></span></a></li>
                                        <li><a href="#"><span class="fa fa-google-plus"></span></a></li>
                                        <li><a href="#"><span class="fa fa-pinterest"></span></a></li>
                                        <li><a href="#"><span class="fa fa-dribbble"></span></a></li>
                                    </ul>
                                </div>

                            </div>
                            <!-- end item -->

                            <!-- card item -->
                            <div class="card-about card-item" id="about" style="background-image:url(images/background/2.jpg)">
                                <div class="card-inner">
                                    <h4 class="title">关于我</h4>
                                    <div class="text">
                                        个性开朗，容易相处，有责任感，团队荣誉感强</br>
                                        为人友善、真诚、做事细致、专注，有很强的责任心</br>
                                        学习能力与适应能力强，喜欢与他人交谈，热爱生活性格标签是认真</br>
                                        有着沉静内敛，善于思考和研究的特质</br>
                                        熟悉网络编辑工作流程，对基本的办公事宜有所了解
                                    </div>
                                    <div class="info-list">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <ul class="list-style-one">
                                                    <li><strong>名字:</strong> 何飞 </li>
                                                    <li><strong>电话:</strong> +86 180 622 198 63 </li>
                                                    <li><strong>地址:</strong> 湖北省孝感市 </li>
                                                </ul>
                                            </div>
                                            <div class="col-md-6">
                                                <ul class="list-style-one">
                                                    <li><strong>电子邮件:</strong> 572298764@qq.com </li>
                                                    <li><strong>学校:</strong> 文华学院 </li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                    <h4 class="title">专业技能</h4>
                                    <div class="row">
                                        <!-- About Block -->
                                        <div class="skill-block col-md-3 col-sm-4 col-xs-6">
                                            <div class="inner-box">
                                                <div class="graph-outer">
                                                    <input type="text" class="dial" data-fgColor="#9147ff" data-bgColor="#f5f5f5" data-width="90" data-height="90" data-linecap="normal" value="75">
                                                    <div class="inner-text count-box"><span class="count-text" data-stop="75" data-speed="2000"></span>%</div>
                                                </div>
                                                <h3>css</h3>
                                            </div>
                                        </div>

                                        <!-- About Block -->
                                        <div class="skill-block col-md-3 col-sm-4 col-xs-6">
                                            <div class="inner-box">
                                                <div class="graph-outer">
                                                    <input type="text" class="dial" data-fgColor="#ff5e7e" data-bgColor="#f5f5f5" data-width="90" data-height="90" data-linecap="normal" value="75">
                                                    <div class="inner-text count-box"><span class="count-text" data-stop="75" data-speed="2000"></span>%</div>
                                                </div>
                                                <h3>HTML</h3>
                                            </div>
                                        </div>

                                        <!-- About Block -->
                                        <div class="skill-block col-md-3 col-sm-4 col-xs-6">
                                            <div class="inner-box">
                                                <div class="graph-outer">
                                                    <input type="text" class="dial" data-fgColor="#ffc713" data-bgColor="#f5f5f5" data-width="90" data-height="90" data-linecap="normal" value="75">
                                                    <div class="inner-text count-box"><span class="count-text" data-stop="75" data-speed="2000"></span>%</div>
                                                </div>
                                                <h3>JavaScript </h3>
                                            </div>
                                        </div>

                                        <!-- About Block -->
                                        <div class="skill-block col-md-3 col-sm-4 col-xs-6">
                                            <div class="inner-box">
                                                <div class="graph-outer">
                                                    <input type="text" class="dial" data-fgColor="#51dbc3" data-bgColor="#f5f5f5" data-width="90" data-height="90" data-linecap="normal" value="75">
                                                    <div class="inner-text count-box"><span class="count-text" data-stop="75" data-speed="2000"></span>%</div>
                                                </div>
                                                <h3>PHP </h3>
                                            </div>
                                        </div>
                                    </div>

                                </div>
                            </div>
                            <!-- end item -->

                            <!-- card item -->
                            <div class="card-resume card-item" id="resume" style="background-image:url(images/background/2.jpg)">
                                <div class="card-inner">
                                    <h4 class="title">简历</h4>
                                    <div class="row clearfix">
                                        <!--Column-->
                                        <div class="timeline-column col-md-6 col-sm-12 col-xs-12">
                                            <div class="inner">
                                                <div class="col-header">
                                                    <div class="icon-box">
                                                        <div class="icon-inner">
                                                            <div class="icon"><span class="flaticon-book"></span></div>
                                                        </div>
                                                    </div>
                                                    <h2>专业技能</h2>
                                                </div>

                                                <!--Timeline Block-->
                                                <div class="timeline-block">
                                                    <div class="inner-box">
                                                        <h4>Web设计语言及<b>框架</b></h4>
                                                        <div class="date">html,css,JavaScript</br>
                                                            <b>react,vue</b>
                                                        </div>
                                                    </div>
                                                </div>

                                                <!--Timeline Block-->
                                                <div class="timeline-block">
                                                    <div class="inner-box">
                                                        <h4>Web设计工具及<b>服务器</b></h4>
                                                        <div class="date">sass,jquery,<b>node.js</b>
                                                        </div>
                                                    </div>
                                                </div>

                                                <!--Timeline Block-->
                                                <div class="timeline-block">
                                                    <div class="inner-box">
                                                        <h4>其他技能</h4>
                                                        <div class="date">pr,ps等<b>视频剪辑软件</b></br>
                                                            word,excel,ppt等办公软件
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <!--Column-->
                                        <div class="timeline-column col-md-6 col-sm-12 col-xs-12">
                                            <div class="inner">
                                                <div class="col-header">
                                                    <div class="icon-box">
                                                        <div class="icon-inner">
                                                            <div class="icon"><span class="flaticon-case"></span></div>
                                                        </div>
                                                    </div>
                                                    <h2>工作经历</h2>
                                                </div>

                                                <!--Timeline Block-->
                                                <div class="timeline-block">
                                                    <div class="inner-box">
                                                        <h4>大学生乡村实习</h4>
                                                        <div class="date"><span>2021.7 – 2021.8</span> </div>
                                                        <div class="text"> 负责整理疫情<b>Excel表格</b>，做数据的整理</div>
                                                    </div>
                                                </div>

                                                <!-- <div class="timeline-block">
                                                    <div class="inner-box">
                                                        <h4>在线视频剪辑工作室 </h4>
                                                        <div class="date"><span>2020.6 – 现在 </span> </div>
                                                        <div class="text">负责视频的<b>后期剪辑</b>，<b>字幕</b>的添加。</br>
                                                            相关网课的<b>录制</b>
                                                            </div>
                                                    </div>
                                                </div>-->
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <!-- end item -->
                            <!-- card item -->
                            <div class="card-services card-item" id="services" style="background-image:url(images/background/2.jpg)">
                                <div class="card-inner">
                                    <h4 class="title">服务</h4>
                                    <div class="row">
                                        <div class="services-block col-md-6">
                                            <div class="inner-box">
                                                <div class="icon-box"><span class="icon flaticon-pen-tool"></span></div>
                                                <h4><a href="blog-single.html">UI/UX 设计</a></h4>
                                                <div class="text">UI/UX 设计 </div>
                                            </div>
                                        </div>
                                        <div class="services-block col-md-6">
                                            <div class="inner-box">
                                                <div class="icon-box"><span class="icon flaticon-folder"></span></div>
                                                <h4><a href="blog-single.html">Web 设计</a></h4>
                                                <div class="text">web 设计 </div>
                                            </div>
                                        </div>
                                        <div class="services-block col-md-6">
                                            <div class="inner-box">
                                                <div class="icon-box"><span class="icon flaticon-computer"></span></div>
                                                <h4><a href="blog-single.html">品牌</a></h4>
                                                <div class="text">品牌</div>
                                            </div>
                                        </div>
                                        <div class="services-block col-md-6">
                                            <div class="inner-box">
                                                <div class="icon-box"><span class="icon flaticon-layers-1"></span></div>
                                                <h4><a href="blog-single.html">Logo 设计</a></h4>
                                                <div class="text">logo设计 </div>
                                            </div>
                                        </div>
                                        <div class="services-block col-md-6">
                                            <div class="inner-box">
                                                <div class="icon-box"><span class="icon flaticon-web-design"></span>
                                                </div>
                                                <h4><a href="blog-single.html">Apps 设计</a></h4>
                                                <div class="text">apps设计 </div>
                                            </div>
                                        </div>
                                        <div class="services-block col-md-6">
                                            <div class="inner-box">
                                                <div class="icon-box"><span class="icon flaticon-photo-camera"></span>
                                                </div>
                                                <h4><a href="blog-single.html">Photography</a></h4>
                                                <div class="text">ps </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- end item -->
                            <!-- card item -->
                            <div class="card-projects card-item" id="work" style="background-image:url(images/background/2.jpg)">
                                <div class="card-inner">
                                    <h4 class="title">工作</h4>
                                    <div class="row">
                                        <div class="projects-block col-md-6">
                                            <div class="inner-box">
                                                <figure class="image">
                                                    <img src="images/gallery/1.jpg" alt="image">
                                                    <div class="overlay">
                                                        <a class="lightbox-image option-btn" title="Image Caption Here" data-fancybox-group="example-gallery" href="images/gallery/1.jpg">
                                                            <i class="fa fa-search"></i>
                                                        </a>
                                                    </div>
                                                </figure>
                                                <div class="caption-title">
                                                    <h3><a href="#">名称</a></h3>
                                                    <span>商标</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="projects-block col-md-6">
                                            <div class="inner-box">
                                                <figure class="image">
                                                    <img src="images/gallery/2.jpg" alt="image">
                                                    <div class="overlay">
                                                        <a class="lightbox-image option-btn" title="Image Caption Here" data-fancybox-group="example-gallery" href="images/gallery/2.jpg">
                                                            <i class="fa fa-search"></i>
                                                        </a>
                                                    </div>
                                                </figure>
                                                <div class="caption-title">
                                                    <h3><a href="#">名称</a></h3>
                                                    <span>商标</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="projects-block col-md-6">
                                            <div class="inner-box">
                                                <figure class="image">
                                                    <img src="images/gallery/3.jpg" alt="image">
                                                    <div class="overlay">
                                                        <a class="lightbox-image option-btn" title="Image Caption Here" data-fancybox-group="example-gallery" href="images/gallery/3.jpg">
                                                            <i class="fa fa-search"></i>
                                                        </a>
                                                    </div>
                                                </figure>
                                                <div class="caption-title">
                                                    <h3><a href="#">名称</a></h3>
                                                    <span>商标</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="projects-block col-md-6">
                                            <div class="inner-box">
                                                <figure class="image">
                                                    <img src="images/gallery/4.jpg" alt="image">
                                                    <div class="overlay">
                                                        <a class="lightbox-image option-btn" title="Image Caption Here" data-fancybox-group="example-gallery" href="images/gallery/4.jpg">
                                                            <i class="fa fa-search"></i>
                                                        </a>
                                                    </div>
                                                </figure>
                                                <div class="caption-title">
                                                    <h3><a href="#">名称</a></h3>
                                                    <span>商标</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="projects-block col-sm-6">
                                            <div class="inner-box">
                                                <figure class="image">
                                                    <img src="images/gallery/5.jpg" alt="image">
                                                    <div class="overlay">
                                                        <a class="lightbox-image option-btn" title="Image Caption Here" data-fancybox-group="example-gallery" href="images/gallery/5.jpg">
                                                            <i class="fa fa-search"></i>
                                                        </a>
                                                    </div>
                                                </figure>
                                                <div class="caption-title">
                                                    <h3><a href="#">名称</a></h3>
                                                    <span>商标</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="projects-block col-sm-6">
                                            <div class="inner-box">
                                                <figure class="image">
                                                    <img src="images/gallery/6.jpg" alt="image">
                                                    <div class="overlay">
                                                        <a class="lightbox-image option-btn" title="Image Caption Here" data-fancybox-group="example-gallery" href="images/gallery/6.jpg">
                                                            <i class="fa fa-search"></i>
                                                        </a>
                                                    </div>
                                                </figure>
                                                <div class="caption-title">
                                                    <h3><a href="#">名称</a></h3>
                                                    <span>商标</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- end item -->
                            <!-- card item -->
                            <div class="card-blog card-item" id="blog" style="background-image:url(images/background/2.jpg)">
                                <div class="card-inner">
                                    <h4 class="title">博客</h4>
                                    <div class="news-block">
                                        <div class="inner-box">
                                            <div class="image">
                                                <img src="images/resource/blog-1.jpg" alt="">
                                                <div class="overlay">
                                                    <a class="link-btn" href="blog-single.html">
                                                        <i class="fa fa-link"></i>
                                                    </a>
                                                </div>
                                            </div>
                                            <div class="date"><strong>02</strong> <br>Sep</div>
                                            <div class="lower-content">
                                                <h4><a href="blog-single.html">关于网页设计</a></h4>
                                                <div class="post-meta">何飞 / <span>设计</span></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="news-block">
                                        <div class="inner-box">
                                            <div class="image">
                                                <img src="images/resource/blog-2.jpg" alt="">
                                                <div class="overlay">
                                                    <a class="link-btn" href="blog-single.html">
                                                        <i class="fa fa-link"></i>
                                                    </a>
                                                </div>
                                            </div>
                                            <div class="date"><strong>04</strong> <br>Sep</div>
                                            <div class="lower-content">
                                                <h4><a href="blog-single.html">关于网页设计</a></h4>
                                                <div class="post-meta">何飞 / <span>设计</span></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="news-block">
                                        <div class="inner-box">
                                            <div class="image">
                                                <img src="images/resource/blog-3.jpg" alt="">
                                                <div class="overlay">
                                                    <a class="link-btn" href="blog-single.html">
                                                        <i class="fa fa-link"></i>
                                                    </a>
                                                </div>
                                            </div>
                                            <div class="date"><strong>06</strong> <br>Sep</div>
                                            <div class="lower-content">
                                                <h4><a href="blog-single.html">关于网页设计</a></h4>
                                                <div class="post-meta">何飞 / <span>设计</span></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- end item -->
                            <!-- card item -->
                            <div class="card-contact card-item" id="contact" style="background-image:url(images/background/2.jpg)">
                                <div class="card-inner">
                                    <h3 class="title">联系方式</h3>
                                    <h4>保持联系</h4>
                                    <div class="row clearfix">
                                        <div class="col-md-6">
                                            <ul class="list-style-two">
                                                <li><span class="icon flaticon-signs"></span><br>湖北省孝感市
                                                </li>
                                                <li><span class="icon flaticon-smartphone"></span><br>+86 180 6221 9863
                                                </li>
                                                <li><span class="icon flaticon-note-1"></span><br>572298764@qq.com
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="map-section">
                                                <div class="home-google-map">
                                                    <div class="google-map" id="contact-google-map" data-map-lat="40.700843" data-map-lng="-74.004012" data-icon-path="images/icons/map-marker.png" data-map-title="Chester" data-map-zoom="11">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <h4>帮助</h4>
                                    <!-- Contact Form -->
                                    <div class="contact-form">
                                        <!--Comment Form-->
                                        <form method="post" action="sendemail.php" id="contact-form">
                                            <div class="row clearfix">

                                                <div class="col-md-6 form-group">
                                                    <input type="text" name="username" placeholder="姓名" required>
                                                </div>

                                                <div class="col-md-6 form-group">
                                                    <input type="email" name="email" placeholder="电子邮件" required>
                                                </div>

                                                <div class="col-md-6 form-group">
                                                    <input type="text" name="subject" placeholder="主题" required>
                                                </div>

                                                <div class="col-md-6 form-group">
                                                    <input type="text" name="phone" placeholder="电话" required>
                                                </div>

                                                <div class="col-lg-12 col-md-12 form-group">
                                                    <textarea name="message" placeholder="内容"></textarea>
                                                </div>

                                                <div class="col-lg-12 col-md-12 form-group">
                                                    <button class="theme-btn btn-style-two" type="submit" name="submit-form">提交</button>
                                                </div>

                                            </div>
                                        </form>

                                    </div>
                                    <!--End Contact Form -->

                                </div>
                            </div>
                            <!-- end item -->

                        </div>
                    </div>

                </div>
            </div>

        </div>

    </div>
    <!--End pagewrapper-->
    <script type="text/javascript">
        var myVar = setInterval("toggleSound()", 100);

        function toggleSound() {
            var a = document.getElementById("vd"); //获取ID  
            if (a.paused) { //判读是否播放  
                a.play(); //没有就播放 
            }
        }
    </script>
    <script src="js/jquery.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/jquery.mCustomScrollbar.concat.min.js"></script>
    <script src="js/owl.js"></script>
    <script src="js/wow.js"></script>
    <script src="js/appear.js"></script>
    <script src="js/jquery.fancybox.js"></script>
    <script src="js/element-in-view.js"></script>
    <script src="js/knob.js"></script>
    <script src="js/validate.js"></script>
    <script src="js/mousemoveparallax.js"></script>
    <script src="js/pagenav.js"></script>
    <script src="js/jquery-type.js"></script>
    <script src="js/jquery.nicescroll.min.js"></script>
    <script src="js/particle-alone.js"></script>
    <script src="js/script.js"></script>
    <!--Google Map APi Key-->
    <script src="http://ditu.google.cn/maps/api/js?key=AIzaSyATY4Rxc8jNvDpsK8ZetC7JyN4PFVYGCGM"></script>
    <script src="js/gmaps.js"></script>
    <script src="js/map-script.js"></script>
    <!--End Google Map APi-->
    <script src="http://ditu.google.cn/maps/api/js?key=AIzaSyATY4Rxc8jNvDpsK8ZetC7JyN4PFVYGCGM"></script>
    <script src="js/gmaps.js"></script>
    <script src="js/map-script.js"></script>
    <script src="https://l2dwidget.js.org/lib/L2Dwidget.min.js"></script>
    <script type="text/javascript">
        L2Dwidget
            .on('*', (name) => {
                console.log('%c EVENT ' + '%c -> ' + name, 'background: #222; color: yellow', 'background: #fff; color: #000')
            })
            .init({
                display: {
                    // 居左
                    "position": "right",
                    // 宽度
                    "width": 200,
                    // 高度
                    "height": 400,
                    // 距左右
                    "hOffset": 35,
                    // 距下
                    "vOffset": -20
                },

                mobile: {
                    // 移动端，false为关闭
                    "show": true,
                    "scale": 0.5
                },

                dialog: {
                    // 开启对话框，false为关闭
                    enable: true,
                    script: {
                        // 每空闲 10 秒钟，显示一条一言
                        'every idle 10s': '$hitokoto$',
                        // 当触摸到角色身体
                        'tap body': '哎呀！别碰我！',
                        // 当触摸到角色头部
                        'tap face': '人家已经不是小孩子了！'
                    }
                }
            });
    </script>
</body>

</html>
